<!-- 线路概览 -->
<template>
  <img src="/src/assets/uiResources/sub.png" alt="" style="width: 100%; height: 230px;padding:0 10px" id="imgTools"/>
</template>

<script setup>
import Viewer from 'viewerjs';
import { nextTick,onMounted } from 'vue';

onMounted(()=>{
    nextTick(()=>{
        const viewer = new Viewer(document.getElementById('imgTools'),{
            //inline: true,//在当前的容器中进行图片展示
            navbar:false,//是否显示底部导航栏
            toolbar:false,//标题栏是否显示和布局
            viewed() {//当查看图片时被触发的函数 每次查看都会触发 在view之后
                viewer.zoomTo(0.1);
            },
        })
    })
})

</script>

<style>
#image {
  width: 200px;
}
</style>